import { createApp } from "vue";
import { createPinia } from "pinia";
import piniaPluginPersistedstate from "pinia-plugin-persistedstate";

import App from "./App.vue";
import router from "./router";
import { createService } from "@/utils/request"; // 引入工厂方法

// import FastClick from 'fastclick'
import Vant from "vant";
import "vant/lib/index.css";
import "./assets/main.css"; // 全局样式
import { i18n, setVantLocale } from "./lang";

// 初始化Vant语言
setVantLocale(i18n.global.locale.value);

// 引入vconsole
//import VConsole from "vconsole";
// const isDev = typeof process !== 'undefined' && process.env.NODE_ENV === 'development'
// const isMobile = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent);
// if (isMobile) {
//   const vConsole = new VConsole(); // 正确实例化
// }

// import imgDialogPlugin from './plugins/img-dialog'

const pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
const app = createApp(App);

// 导出供全局使用
export default pinia;

app.use(createPinia());
app.use(pinia);
app.use(router);
app.use(Vant); // 全局注册Vant组件
// app.use(imgDialogPlugin)
app.use(i18n);

// ------------------------------ 下面是取消页面左右滑动翻页的逻辑 start -----------------------------------
let startX = 0;
let startY = 0;

const initSwipeBlocker = () => {
  const handleTouchStart = (e) => {
    startX = e.touches[0].clientX;
    startY = e.touches[0].clientY;
  };

  const handleTouchMove = (e) => {
    const currentX = e.touches[0].clientX;
    const currentY = e.touches[0].clientY;

    // 计算滑动方向（阈值可调整）
    const deltaX = currentX - startX;
    const deltaY = currentY - startY;
    const isSwipingHorizontally = Math.abs(deltaX) > Math.abs(deltaY) * 1.5;

    // 仅拦截横向滑动且不在滚动区域
    if (isSwipingHorizontally && !isScrollingElement(e.target)) {
      e.preventDefault();
      e.stopPropagation();
    }
  };

  document.addEventListener("touchstart", handleTouchStart, { passive: true });
  document.addEventListener("touchmove", handleTouchMove, { passive: false });
};

// 检测是否在可滚动元素内
const isScrollingElement = (el) => {
  const scrollableTags = ["BODY", "HTML", "DIV", "SECTION", "ARTICLE"];
  const style = window.getComputedStyle(el);

  return (
    scrollableTags.includes(el.tagName) &&
    (style.overflowY === "auto" || style.overflowY === "scroll")
  );
};

// 初始化
initSwipeBlocker();
// ---------------------------- 下面是取消页面左右滑动翻页的逻辑 end -----------------------------------

// FastClick.attach(document.body) // 300ms 点击延迟

app.mount("#app");

// 导出全局服务实例
export const http = createService(pinia);
